<!--
 * @description  : 实地核查登记
 * @descriptionDetail: 实地核查登记
 * @copyright    : 浙江烟草
 * @author       : mwq
 * @create       : 2022-09-27 09:58:58
-->

<template>
  <view>
    <!-- #ifdef H5-ONLY -->
    <theme-navbar
      :is-white="false"
      :title="navTitle"
      :custom-back="goBack"
      style="z-index: 99999"
    >
    </theme-navbar>
    <!-- #endif -->
    <u-card
      margin="20rpx"
      :show-head="false"
      :show-foot="false"
      thumb="../../../../static/check/pending-approval.png"
      thumb-width="38"
      box-shadow="#e5e5e5 0px 0px 50px"
    >
      <template #body>
        <u-row gutter="12">
          <u-col span="1">
            <u-image src="../../../static/fieldAudit/retialer.png" width="25px" height="25px"></u-image>
          </u-col>
          <u-col span="9" class="top">
            {{ data.customerName }}
          </u-col>
        </u-row>
        <u-row gutter="12" style="margin-top:10px;">
          <u-col span="1">
          </u-col>
          <u-col span="9" class="middle">
            {{ data.customerAddresses }}
          </u-col>
        </u-row>
        <u-row gutter="10" class="bottom" style="margin-top:5px;">
          <u-col span="1"></u-col>
          <u-col span="2" class="left">
            {{ data.principalName }}
          </u-col>
          <u-col span="0.5" class="middle">
            |
          </u-col>
          <u-col span="5" class="right">
            {{ data.telephone }}
          </u-col>
        </u-row>
      </template>
    </u-card>
    <u-card
      margin="20rpx"
      :show-head="false"
      :show-foot="false"
      thumb="../../../../static/check/pending-approval.png"
      thumb-width="38"
      box-shadow="#e5e5e5 0px 0px 50px"
    >
      <template #body>
        <view v-for="(it, idx) in listDatas" :key="idx" style="margin-bottom:20px;">
          <u-row gutter="10">
            <u-col span="9.5" class="left2" v-if="it.checkAnnalName==null || it.checkAnnalName==''" @tap="getWorkItemsList(it.checkAnnalUuid)">
              无名称
            </u-col>
            <u-col span="9.5" class="left2" v-else @tap="getWorkItemsList(it.checkAnnalUuid)">
              {{ it.checkAnnalName }}
            </u-col>
            <u-col span="2.5" class="right2" @tap="goDetail(it.checkAnnalUuid)">
              任务详情
            </u-col>
          </u-row>
          <view v-if="it.checkAnnalUuid==checkAnnalUuid">
            <div v-for="(pages, index) in pages" :key="index">
              <components :is="pages.name" :params="pages.params" ref="child"></components>
            </div>
          </view>
          <u-card
            :show-head="false"
            :show-foot="false"
            margin="0"
            :border="false"
            v-if="it.checkAnnalUuid==checkAnnalUuid"
          >
            <template #body>
              <u-row gutter="16" justify="space-around">
                <u-col span="5" text-align="center">
                  <u-button type="primary" size="medium" shape="circle" v-if="isSubmit" @tap="submit">
                    提交
                  </u-button>
                  <u-button size="medium" shape="circle" :disabled="true" v-if="finished">
                    已完成
                  </u-button>
                </u-col>
                <u-col span="5" text-align="center">
                  <u-button size="medium" shape="circle" @tap="showSearch=false">
                    发起协同
                  </u-button>
                </u-col>
              </u-row>
            </template>
          </u-card>
        </view>
      </template>
    </u-card>
  </view>
</template>
<script>
import MescrollMoreMixin from "@/components/mescroll-uni/mixins/mescroll-more.js";
import multiSelect from '@/components/multi-select.vue';
import fieldAuditService from "@/service/internal/fieldAudit.service.js";
export default {
  components: {multiSelect,},
  mixins: [MescrollMoreMixin,],
  data(){
    return{
      custAdd:"",
      itemchecked:false,
      personShow: false,
      isSubmit: true, // 是否显示提交按钮
      finished: false, // 是否显示已完成按钮
      data: '', // 上一个页面携带的参数
      pages: [],
      formData:{},
      licNo:'',
      listDatas:[], // 核查任务
      itemDatas:[], // 核查项
      checkAnnalUuid:'',
      componentConfig:{
        '91404':'my-textarea',
        '91405':'my-upload',
        '91415':'my-multi-product',
        '91420':'my-multi-select',
      },
    };
  },
  onLoad(){
    this.data = this.getRouteParam();
    this.getCheckTaskList(this.data.licNo);
  },
  methods:{
    // 零售户核查任务列表
    getCheckTaskList(licNo){
      fieldAuditService.listCheckTasks(licNo).then((res) => {
        if(res.success){
          this.listDatas = res.data;
        }else{
          this.$u.toast(res.msg);
        }
      }).catch((error) => {
        this.$u.toast(error);
      });
    },
    // 核查项列表
    getWorkItemsList(checkAnnalUuid){
      uni.showLoading({
        title: '加载中..',
        mask: true,
      });
      // 动态获取核查项组件
      fieldAuditService.listWorkItems(checkAnnalUuid).then((res) => {
        if(res.success){
          uni.hideLoading();
          this.itemDatas = [];
          this.itemDatas = res.data;
          this.checkAnnalUuid = checkAnnalUuid;
          this.pages = [];
          this.itemDatas.forEach(p => {
            if(this.componentConfig[p.operateType] != null){
              let url = this.componentConfig[p.operateType];
              let name = resolve => require.ensure([], () => resolve(require('@/pages/internal/fieldAudit/components/' + url + '.vue')));
              let label = p.itemName;
              let contentOptions = p.contentOptions;
              let products = p.products;
              this.pages.push({
                name:name,
                params:{
                  label: label,
                  contentOptions:contentOptions,
                  listDatas: products,
                  checkAnnalUuid: checkAnnalUuid,
                },
              });
              console.log(this.pages);
            }
          });
        }else{
          this.$u.toast(res.msg);
        }
      }).catch((error) => {
        this.$u.toast(error);
      });
    },
    // 任务详情
    goDetail(checkAnnalUuid){
      uni.navigateTo({
        url: this.$u.route("pages/internal/fieldAudit/indexRegisterDetail",{
          checkAnnalUuid: checkAnnalUuid,
        }),
      });
    },
    // 实地核查提交
    submit(){
      console.log(this.$refs.child[0].test);
      let childData = this.$refs.child;

      for(let i = 0;i < childData.length;i++){
        this.itemDatas[i].checkData = childData[i].itemData;
        this.itemDatas[i].products = childData[i].products;
        this.itemDatas[i].checkUuid = this.checkAnnalUuid;
      }
      console.log(this.itemDatas.toString());
      uni.showLoading({
        title: '提交中..',
        mask: true,
      });
      fieldAuditService.saveCheckResults(this.itemDatas).then((res) => {
        if(res.success){
          uni.hideLoading();
          this.isSubmit = false;
          this.finished = true;
        }else{
          this.$u.toast(res.msg);
        }
      }).catch((error) => {
        this.$u.toast(error);
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.news-li{
		font-size: 32rpx;
		padding: 32rpx;
		border-bottom: 1rpx solid #eee;
	}
	.news-li .new-content{
		font-size: 28rpx;
		margin-top: 10rpx;
		margin-left: 20rpx;
		color: #666;
	}
  .top{
    font-size: 18px;
    font-family: ".PingFang SC";
    font-weight: 600;
    color: #333333;
    opacity: 1;
  }
  .middle{
    font-size: 14px;
    font-family: ".PingFang SC";
    font-weight: 400;
    color: #999999;
    opacity: 1;
  }
  .bottom .left{
    font-size: 16px;
    font-family: ".PingFang SC";
    font-weight: 600;
    color: #666666;
    opacity: 1;
  }
  .bottom .middle{
    opacity: 1;
    border-radius: 0px;
  }
  .bottom .right{
    font-size: 16px;
    font-family: ".PingFang SC";
    font-weight: 600;
    color: #027AFF;
    opacity: 1;
  }
  .left2{
    font-size: 16px;
    font-weight: 600;
    color: #171A1D;
    opacity: 1;
  }
  .right2{
    font-size: 14px;
    font-weight: 500;
    color: #027AFF;
    opacity: 1;
  }
</style>
